<template>
  <div class="center" >
    
    <el-card class="index" v-if="!mchId">
      <div slot="header" class="clearfix">
        <span>进件主体类型</span>
      </div>
      <div >
        <el-radio-group v-model="userType" @input="userTypeChange" >
          <el-radio :disabled="merchantInfo.id" label="2">企业/个体工商</el-radio>
          <el-radio :disabled="merchantInfo.id" label="1">小微商户</el-radio>
        </el-radio-group>
      </div>
    </el-card>
      <el-card class="index" v-if="userinfo.rolesId != 4">
      <div slot="header" class="clearfix">
        <span>业务员信息</span>
      </div>
      <el-form
             label-position="top"
            :model="ruleForm"
            status-icon
            :inline="true"
            :rules="rules"
            ref="ruleForm"
            class="demo-ruleForm"
          >
          <el-row>
            <el-col :span="6">
             <el-form-item
              v-if="
                userinfo.rolesId != 2 &&
                userinfo.rolesId != 3 &&
                userinfo.rolesId != 4"
              label="一级服务商"
              prop="agent1"
            >
              <el-autocomplete
                class="service"
                v-model.trim="ruleForm.agent1"
                :fetch-suggestions="querySearch"
                placeholder="请选择一级服务商"
                @select="serviceid"
              ></el-autocomplete>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item
              v-if="userinfo.rolesId != 3 && userinfo.rolesId != 4"
              label="二级服务商"
              prop="agent2"
            >
              <el-autocomplete
                class="service"
                v-model.trim="ruleForm.agent2"
                :fetch-suggestions="querySearch2"
                placeholder="请选择二级服务商"
                @select="serviceid2"
              ></el-autocomplete>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item
              v-if="userinfo.rolesId != 4"
              label="业务经理"
              prop="BDname"
            >
              <el-autocomplete
                class="service"
                v-model.trim="ruleForm.BDname"
                :fetch-suggestions="BDname"
                placeholder="请选择业务经理"
                @select="BDid"
              ></el-autocomplete>
             </el-form-item>
            </el-col>
            
          </form>
        </el-row>
    </el-card>
  </div>
</template>

<script>
import {
  getservice,
  getBD,
  parentlist,
  banklist,
  ratelist,
  merchantsave,
  arealist,
  mcclist,
  APIuploadImage,
  queryAgentProfitByChannel,
} from "@/api/api";
 export default{
    name:'basicInformation',
    props:{
      regionList:[Array],
      userinfo:[Object],
      merchantInfo:[Object],
      mchId:[String],
      channelType:[String]
    },
    watch:{
      merchantInfo(nValue){
        console.log(nValue)
        this.serviceid({id:nValue.agent1Id},'none')
        this.getBD(nValue.agent2Id)
        // this.getservice()
        this.ruleForm.agent1 = nValue.agent1Name
        this.ruleForm.agent1Id = nValue.agent1Id
        this.ruleForm.agent2 = nValue.agent2Name
        this.ruleForm.agent2Id = nValue.agent2Id
        this.ruleForm.bdId = nValue.bdId
        this.ruleForm.BDname = nValue.bdName
        deep:true
      },
    },
    data(){
        return{
          userType:'2',
          BDarr:[],
          servicearr1:[],
          servicearr2:[],
          personalForm:{

          },
          ruleForm:{
            agent1:'',
            agent1Id:'',
            agent2:'',
            agent2Id:'',
            bdId:'',
            BDname:''
          },
          rules:{
            agent1:[{ required: true, message: '请选择一级服务商', trigger: 'change' }],
            agent2:[{ required: true,  validator:(rule , value , callback)=>{
                 if(this.ruleForm.agent2){
                  callback();
                 }else{
                  callback(new Error('请选择二级服务商！'))
                 }
            }}],
            BDname:[{ required: true, validator:(rule , value , callback)=>{
                 if(this.ruleForm.BDname){
                  callback();
                 }else{
                  callback(new Error('请选择业务经理！'))
                 }
            } }],
          },
          enterpriseForm:{},
          enterpriseFormRules:{},
          mccList:[],
          sceneTypeList:[ { value:'ONLINE',lable:'线上场景' } , { value:'OFFLINE',lable:'线下场景' } , { value:'ALL',lable:'线上线下' } ],
          entTypeList:[ { value:'1',lable:'政府机构' } , { value:'2',lable:'国营企业' } , { value:'3',lable:'私营企业' } , { value:'4',lable:'外资企业' } , { value:'5',lable:'个体工商户' } , { value:'6',lable:'其它组织' } , { value:'7',lable:'事业单位' } , { value:'9',lable:'业主委员会' }],
          licenseTypeList:[ { value:'NATIONAL_LEGAL',lable:'营业执照' } , { value:'NATIONAL_LEGAL_MERGE',lable:'营业执照(多证合一)' } , { value:'INST_RGST_CTF',lable:'事业单位法人证书' } , { value:'CERTIFICATE_TYPE_0001',lable:'社会团体法人登记证书' } , { value:'CERTIFICATE_TYPE_0002',lable:'民办非企业单位登记证书' } , { value:'CERTIFICATE_TYPE_0003',lable:'基金会法人登记证书' } , { value:'CERTIFICATE_TYPE_0004',lable:'宗教活动场所登记证' } , { value:'CERTIFICATE_TYPE_0005',lable:'其他证书/批文/证明' } , { value:'CERTIFICATE_TYPE_0006',lable:'执业许可证/执业证' } , { value:'CERTIFICATE_TYPE_0008',lable:'农村集体经济组织登记证' }],
          certificateList:[ {value:'00',label:'身份证'} , {value:'04',label:'回乡证'} , {value:'14',label:'台胞证'} , {value:'15',label:'港澳台居住证'} ],
          smsSendFlagList:[ {value:'M',label:'发送短信通知'} , {value:'E',label:'发送邮件通知'} , {value:'A',label:'短信、邮件都通知'} ]
        }
    },
    mounted(){
      // this.initGetservice()
    },
    methods:{
      initDetleData(){
        
      },
      initGetservice(){
        console.log(this.userinfo.rolesId)
        setTimeout(()=>{
        if (this.userinfo.rolesId == 2) {
          this.serviceid(this.userinfo.fid);
        } else if (this.userinfo.rolesId == 3) {
          this.ruleForm.agent2Id = this.userinfo.fid;
          this.getBD(this.userinfo.fid);
        } else if (this.userinfo.rolesId == 4) {
          this.ruleForm.bdId = this.userinfo.fid;
        }else{
          this.getservice()
        }
        },1000)
      },
      getBD(id) {
      let  BDarr = [];
      getBD({ agentid: id }).then((res) => {
        if (res.code == 405) {
          sessionStorage.removeItem("token");
          this.$router.push("/login");
        } else if (res.code == 200) {
          for (var i = 0; i < res.data.rows.length; i++) {
            BDarr.push({
              value: res.data.rows[i].name,
              id: res.data.rows[i].id,
            });
          }
          this.BDarr = BDarr
        }
      });
    },
      userTypeChange(v){
        this.$emit('userTypeChange',v)
      },
      getservice() {
        const servicearr1 = []
      getservice({
        type: 1,
      }).then((res) => {
        if (res.code == 405) {
          sessionStorage.removeItem("token");
          this.$router.push("/login");
        } else if (res.code == 200) {
          for (var i = 0; i < res.data.rows.length; i++) {
            servicearr1.push({
              value: res.data.rows[i].agentname,
              id: res.data.rows[i].id,
            });
          }
          this.servicearr1 = servicearr1
        }
      });
    },
      querySearch(queryString, cb) {
      let servicearr = this.servicearr1;
      let results = queryString
        ? servicearr.filter(this.createFilter(queryString))
        : servicearr;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    // 二级服务商
    querySearch2(queryString, cb) {
      let servicearr = this.servicearr2;
      let results = queryString
        ? servicearr.filter(this.createFilter(queryString))
        : servicearr;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    createFilter(queryString) {
      return (restaurant) => {
        return (
          restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) !==
          -1
        );
      };
    },
    // 根据一级查2级
    serviceid(item,type) {
      console.log(1111)
      this.ruleForm.agent1Id = item.id;
      let servicearr2 = [];
      if(type == 'none'){

      }else{
        this.ruleForm.agent2 = "";
        this.ruleForm.BDname = "";
      }
      getservice({
        type: 2,
        parentid: item.id,
      }).then((res) => {
        for (var i = 0; i < res.data.rows.length; i++) {
          servicearr2.push({
            value: res.data.rows[i].agentname,
            id: res.data.rows[i].id,
          });
        }
        this.servicearr2 = servicearr2
      });
      // this.ruleForm.agent1Id = item.id
    },
    // 获取2级
    serviceid2(item) {
      this.ruleForm.agent2Id = item.id;
      this.ruleForm.agent2 = item.value;
      this.ruleForm.BDname = "";
      this.$forceUpdate()
      this.getBD(item.id);
    },
     BDid(item) {
      this.ruleForm.bdId = item.id
      this.ruleForm.BDname = item.value
      this.initByChannel(item.id)
      this.$forceUpdate()
    },
    async initByChannel(bdId,channelType){
      const res = await  queryAgentProfitByChannel({bdId:bdId,channelType:this.channelType || channelType})
      if(res.code == 200){
        this.$emit('minProfitRateChange' ,res.data.wxProfitRate)
      }else{
        this.$message.error(res.message)
      }
    },
    // 业务经理
    BDname(queryString, cb) {
      let BDarr = this.BDarr;
      let results = queryString
        ? BDarr.filter(this.createFilter(queryString))
        : BDarr;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    }
 }
</script>

<style scoped>
   .index{
    width: 100%;
    margin-bottom: 30px;
   }

</style>